<template>
  <div class='studentDetails'>
    <!-- 头部 -->
    <div class="personal_box">
      <div class="personal_left">
        <div class="img">
          <u--image
            :showLoading="true"
            :src="head"
            width="85px"
            height="100px"
          ></u--image>
        </div>
        <div class="text">
          <u--text
            text="童学"
            size="18"
            bold
          ></u--text>
        </div>
      </div>
    </div>
    <!-- 学籍信息 -->
    <div
      class="modele1"
      style="background: white; width: 100%; padding: 0px 10px"
    >
      <!-- 清华学籍信息 -->
      <div
        class="cell1"
        style="padding: 10px 0px;
      display: flex;
      border-bottom: 1px solid #e8e9ea;
      box-sizing: border-box;"
      >
        <u--image
          :showLoading="true"
          :src="src"
          width="15px"
          height="22px"
        ></u--image>
        <u--text text="清华学籍信息"></u--text>
      </div>
      <u-cell
        size="large"
        title="23班"
      >
        <template slot="value">
          <div class="text">
            <span class="p1">1981</span>
            <span class="p1">入学</span>
            <span class="p1">都高初中部</span>
          </div>
        </template>
      </u-cell>
      <u-cell
        size="large"
        title="148班"
      >
        <template slot="value">
          <div class="text">
            <span class="p1">1981</span>
            <span class="p1">入学</span>
            <span class="p1">都高初中部</span>
          </div>
        </template>
      </u-cell>
    </div>
    <!-- 按钮 -->
    <div
      class="btn_box"
      style="
        padding: 20px 10px;
        box-sizing: border-box;
        background: white;
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
      "
    >
      <button
        class="btn"
        style="background: #1990ff; color: white; border-radius: 10px"
      >
        发送好友申请
      </button>
      <button
        @click="goReturn"
        class="btn"
        style="margin-top: 15px;background: #fff; color: #1990ff; border-radius: 10px;border: 1px solid #1990ff;"
      >
        返回
      </button>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      head: "https://cdn.uviewui.com/uview/album/1.jpg",
      src: require("@/static/index/shuxian.png"),
    }
  },
  methods: {
    goReturn() {
      uni.redirectTo({
        url: "/pages/findAlumni/findAlumni",
      });
    },
  },
}
</script>
<style lang="scss" scoped>
// 头部
.personal_box {
  width: 100%;
  display: flex;
  padding: 15px;
  box-sizing: border-box;
  justify-content: space-between;
  align-items: center;
  background: white;
  margin: 10px 0px;
  // box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  // box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.1), 0 0px 0px 0 rgba(0, 0, 0, 0.1);
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2), 0 0px 0px 0 rgba(0, 0, 0, 0.1);

  .personal_left {
    display: flex;
    align-items: center;
    .img {
      margin-right: 12px;
    }
    .text {
      display: flex;
      flex-direction: column;
      .personal_tag {
        // width: 65px;
        margin-top: 8px;
      }
    }
  }
}
//清华学籍信息
.text {
  .p1 {
    margin-right: 5px;
  }
}
</style>